<template>
  <!-- 检查记录（合格）-- 检查详情 -->
  <view class="goPass">
    <view class="bgColor"></view>

    <view class="wrapper">
      <view class="blueTitle">
        {{ detail.companyMessageInfo.companyName || "" }}
      </view>

      <view class="wrapper-item wrapper-zero">
        <view class="wrapper-facility">
          <view class="facility-item">
            <view class="textAlign label">标准地址：</view>
            <view class="value valueName">
              {{ detail.companyMessageInfo.standardAddress || "" }}
            </view>
          </view>
          <!-- <view class="facility-item">
            <view class="textAlign label">详细地址：</view>
            <view class="value valueName">
              {{ detail.companyMessageInfo.addressDetail || "" }}
            </view>
          </view> -->
          <view class="facility-item">
            <view class="textAlign label">所属行业：</view>
            <view class="value valueName">
              {{ detail.companyMessageInfo.industryInformationName || "" }}
            </view>
          </view>
          <view class="facility-item">
            <view class="textAlign label watuo">负责人姓名：</view>
            <view class="value valueName">
              {{ detail.companyMessageInfo.dutyPersonName || "" }}-{{
                detail.companyMessageInfo.dutyPersonMobile || ""
              }}
            </view>
          </view>
        </view>
      </view>

      <view class="wrapper-item">
        <view class="wrapper-barBlur">
          <view class="wrapper-bartitle"> 检查民警 </view>
        </view>

        <view class="wrapper-body">
          <view class="text-picture">
            <view class="lt">
              <view class="wrapper-facility">
                <view class="facility-item">
                  <view class="textAlign label label-center">所属辖区</view>
                  <i class="label-i">：</i>
                  <view class="value valueName">
                    {{ detail.policeCheckTaskInfo.jurisdictionName || "" }}
                  </view>
                </view>
                <view class="facility-item">
                  <view class="textAlign label label-center">检查民/辅警</view>
                  <i class="label-i">：</i>
                  <view class="value valueName">
                    {{ detail.policeCheckTaskInfo.policeUserName || "暂无" }}
                  </view>
                </view>
                <view class="facility-item">
                  <view class="textAlign label label-center">警号</view>
                  <i class="label-i">：</i>
                  <view class="value valueName">
                    {{ detail.policeCheckTaskInfo.policeUserNo || "暂无" }}
                  </view>
                </view>
                <view class="facility-item">
                  <view class="textAlign label label-center">陪同民/辅警</view>
                  <i class="label-i">：</i>
                  <view class="value valueName">
                    <block v-for="(fu, fuindex) in detail.policeCheckTaskInfo
                        .policeCheckTaskAuxiliaryInfoList" :key="fuindex">
                      {{ fu.policeUserName }}
                      <block v-if="
                          detail.policeCheckTaskInfo
                            .policeCheckTaskAuxiliaryInfoList.length > 1 &&
                          fuindex + 1 !=
                            detail.policeCheckTaskInfo
                              .policeCheckTaskAuxiliaryInfoList.length
                        ">、
                      </block>
                    </block>
                  </view>
                </view>
                <view class="facility-item">
                  <view class="textAlign label label-center">签到照片</view>
                  <i class="label-i">：</i>
                  <view class="value valueName look" @click="
                      pvwImage([
                        imgPrefix + detail.policeCheckTaskInfo.signPicture,
                      ])
                    ">
                    查看
                  </view>
                </view>
              </view>
            </view>
            <view class="rt">
              <image :src="
                  detail.policeCheckTaskInfo.policeUserImage
                    ? imgPrefix + detail.policeCheckTaskInfo.policeUserImage
                    : baseImgUrl + 'queryFace-01.png'
                " mode="" @click="
                  pvwImage([
                    detail.policeCheckTaskInfo.policeUserImage
                      ? imgPrefix + detail.policeCheckTaskInfo.policeUserImage
                      : baseImgUrl + 'queryFace-01.png',
                  ])
                "></image>
            </view>
          </view>
        </view>

        <view style="padding: 25rpx 0"><u-line></u-line></view>

        <view class="wrapper-barBlur">
          <view class="wrapper-bartitle"> 检查民警： </view>
        </view>
        <view class="wrapper-body">
          <view class="wrapper-facility">
            <view class="facility-item">
              <view class="textAlign label">检查类型：</view>
              <view class="value valueName">
                {{ detail.policeCheckTaskInfo.industryExamineName || "" }}
              </view>
            </view>
            <view class="facility-item">
              <view class="textAlign label">检查内容：</view>
              <view class="value valueName look"
                :data-url="`/goOverBag/siteInspectionContent/siteInspectionContent?taskId=${options.taskId}`"
                @click="handleClickRouter">
                查看
              </view>
            </view>
            <view class="facility-item">
              <view class="textAlign label">检查时间：</view>
              <view class="value valueName">
                {{ detail.policeCheckTaskInfo.checkTime || "" }}
              </view>
            </view>
            <view class="facility-item">
              <view class="textAlign label">检查结果：</view>
              <view class="value valueName checkPass">
                {{
                  detail.policeCheckTaskInfo.checkResult == 1
                    ? "合格"
                    : "不合格"
                }}
              </view>
            </view>

            <view class="signature">
              <view>责任人签名：</view>
              <image :src="
                  detail.policeCheckTaskInfo.principalSignatureUrl
                    ? imgPrefix +
                      detail.policeCheckTaskInfo.principalSignatureUrl
                    : baseImgUrl + 'queryFace-01.png'
                " mode="" style="background: #f9f9f9"></image>
            </view>
          </view>
        </view>
      </view>
    </view>
  </view>
</template>

<script>
  import {
    findTaskDetail
  } from "@/api/goover.js";
  import {
    handleClickRouter,
    pvwImage
  } from "@/utils/util.js";

  export default {
    data() {
      return {
        baseImgUrl: this.$baseImgUrl,
        options: {},
        detail: {},
        imgPrefix: uni.getStorageSync("imgPrefix"),
      };
    },
    onLoad(options) {
      this.options = options;
      this.getList();
    },
    methods: {
      handleClickRouter,
      pvwImage,
      getList() {
        findTaskDetail(this.options).then((res) => {
          if (res.code == 200) {
            this.detail = res.result;
          }
        });
      },
    },
  };
</script>

<style>
  page {
    background-color: #f3f3f3 !important;
    height: 100%;
  }
</style>
<style lang="scss" scoped>
  .goPass {
    flex: 1;
    background-color: #f3f3f3;
    margin-bottom: 50px;

    .bgColor {
      width: 100%;
      height: 240rpx;
      background: #2488f5;
    }

    .goPass-title {
      position: absolute;
      top: 10rpx;
      left: 6%;
      color: #ffffff;
      font-size: 34rpx;
      font-weight: bold;
    }

    .wrapper {
      position: absolute;
      top: 30rpx;
      left: 50%;
      transform: translateX(-50%);
      margin-bottom: 50px;

      .blueTitle {
        padding: 20rpx 40rpx;
        border-radius: 10rpx 10rpx 0 0;
        color: #333333;
        font-size: 30rpx;
        font-weight: bold;
        background: #ecf9ff;
      }


      .label-center {
        width: 144rpx;
        min-width: 144rpx;
      }

      .label-i {
        color: #a1a1a1;
      }



      .wrapper-item {
        margin-bottom: 2vh;
        padding: 35rpx 40rpx;
        background-color: #ffffff;
        box-shadow: 0px 3px 6px 1px rgba(123, 123, 123, 0.2);
        border-radius: 10rpx;
        width: 702rpx;

        .wrapper-bar {
          display: flex;
          justify-content: space-between;
          height: 40rpx;

          .wrapper-bartitle {
            font-size: 30rpx;
            font-weight: bold;

            text {
              display: inline-block;
              margin-left: 8px;
              color: #ababab;
              font-size: 28rpx;
            }
          }
        }

        .wrapper-body {
          padding-top: 20px;
        }

        .text-picture {
          display: flex;

          .lt {
            width: 425rpx;
            max-width: 425rpx;

            .name {
              font-size: 30rpx;
              font-family: PingFang SC;
              font-weight: bold;
              margin-bottom: 17rpx;
              margin-top: 20rpx;
            }
          }

          .rt {
            width: 200rpx;
            height: 220rpx;
            margin-left: 20rpx;

            image {
              width: 100%;
              height: 100%;
            }
          }
        }
      }

      .wrapper-zero {
        border-radius: 0 0 10rpx 10rpx;
      }
    }
  }
</style>